<template>
	<!-- 登录 -->
	<view class="web">
		<view class="bj_top">
			<view class="nav">
				<uni-nav-bar class="header" left-icon="left" title="登录" :border="false" backgroundColor="#49a1f8"
					color="#ffff"></uni-nav-bar>
			</view>
		</view>
		<view class="bj_buttom">
			<!-- 验证码登录 -->
			<view class="white_box" v-if="isshow">
				<view class="box_text">
					<h1>验证码登录</h1>
					<h2 @click="isshow=false">密码登录</h2>

				</view>
				<view class="box_input">
					<view class="input_t">
						<input type="number" v-model="form.mobile" placeholder="请输入手机号" />
					</view>
					<view class="input_b">
						<input type="number" v-model="form.code" placeholder="请输入验证码" />
						<text v-show="!hidden" @click="send">获取验证码</text>
						<text v-show="hidden">{{time}}S</text>
					</view>
				</view>
			</view>

			<!-- 密码登录 -->
			<view class="white_box" v-if="!isshow">
				<view class="box_text">
					<h1>密码登录</h1>
					<h2 @click="isshow=true">验证码登录</h2>

				</view>
				<view class="box_input">
					<view class="input_t">
						<input type="number" v-model="form.mobile" placeholder="请输入账号" />
					</view>
					<view class="input_b">
						<input type="text" v-model="form.pass" :password="showPassword" placeholder="请输入密码" />
						<text @click="changePassword" v-show="!reveal" class="iconfont icon-biyan yan"></text>
						<text class="iconfont icon-yanke yan" v-show="reveal" @click="changePassword"></text>

					</view>
				</view>
			</view>
		</view>

		<view class="btn">
			<button @click="login">登录</button>
		</view>
		<p @click="reg">没有账号，立即注册</p>
	</view>
</template>

<script>
	import {
		loginByCode,
		sendcode,
		login
	} from '../../api/login.js'
	export default {
		data() {
			return {
				isshow: true,
				form: {},
				hidden: false,
				time: 10,
				showPassword: true,
				reveal: false
			}
		},
		methods: {
			reg(){
				
				uni.navigateTo({
					url:"/pages/register/registerss"
				})
			},
			async login() {
				let res
				if (this.isshow) {
					// 验证码登录
					if (!this.form.mobile) return uni.showToast({
						title: '请输入手机号',
						icon: 'error'
					})
					let reg = /^1[3-9]\d{9}$/
					if (!reg.test(this.form.mobile)) return uni.showToast({
						title: '手机号格式有误',
						icon: 'error'
					})
					if (!this.form.code) return uni.showToast({
						title: '验证码不可为空',
						icon: 'error'
					})
					let code = /^\d{6}$/
					if (!code.test(this.form.code)) return uni.showToast({
						title: '验证码格式有误',
						icon: 'error'
					})
					res = await loginByCode(this.form).catch(()=>{})
					// console.log(res);
				} else {
					if (!this.form.mobile) return uni.showToast({
						title: '请输入手机号',
						icon: 'error'
					})
					let reg = /^1[3-9]\d{9}$/
					if (!reg.test(this.form.mobile)) return uni.showToast({
						title: '手机号格式有误',
						icon: 'error'
					})
					res = await login(this.form).catch(()=>{})
					// console.log('密码', res);
				}

				if (res?.errCode == 10000) {
					
					console.log(11111111,res);
					uni.showToast({
						title: '登录成功',
					})
					uni.setStorageSync("userid",res.data.userid);
					uni.setStorageSync("buildingState", res.data.buildingState)
					uni.setStorageSync("token", res.data.token)
					uni.setStorageSync("menu", res.data.member)
					uni.switchTab({
						url: '/pages/home/home'
					});
				}
				else{
					
					uni.showToast({
						title:res.errMsg,
						icon:'error'
					})
				}
			},

			// 密码密文
			changePassword: function() {
				this.showPassword = !this.showPassword;
				this.reveal = !this.reveal
			},

			// 发送验证码
			async send() {
				let res = await sendcode({
					mobile: this.form.mobile
				})
				// console.log(res);
				if (res.errCode == '10000') {
					this.hidden = true
					let timer = setInterval(() => {
						this.time--
						if (this.time <= 0) {
							this.hidden = false
							this.time = 10

							clearInterval(timer)
						}
					}, 1000)
				}
			}
		}
	}
</script>

<style>
	@import url('../../static/css/login.css');
</style>